<template>
	<div>
		<div class="header7">
			收藏中心
			<i @click="Jump"></i>
		</div>
		<div class="zong">
			<div class="text7">
				<div class="text7_sub" v-for="item in list2">{{ item }}</div>
			</div>
			<div class="photo7">
				<div class="photo7_sub" v-for="item in list3"><img :src='item' class="photo8" /></div>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		data:function(){
			return{
				list:[],
				list2:[],
				list3:[]
			}
		},
		watch:{
			list:function(){
				console.log(this.list)
				for(var i=0;i<this.list.length;i++){
					// console.log(this.list[i])
					this.$axios.get('http://chonghekj.com/daily/index.php/Home/daily/detail',{
						params:{
							id: this.list[i],
						}
					}).then((res) => {
						// console.log(res)
						this.list2.push(res.data.title)
						this.list3.push(res.data.image)
					})
				}
				console.log(this.list2)
				console.log(this.list3)
				// console.log(this.ww)
				
			}
		},
		methods: {
			Jump: function() {
				this.$router.push({
					path: '/my'
				})
			},
			getList: function() {
				// console.log(JSON.parse(localStorage.getItem('userinfo')).id)
				this.$axios.post('http://chonghekj.com/daily/index.php/Home/user/collection', this.$qs.stringify({
					id: JSON.parse(localStorage.getItem('userinfo')).id,
					access_token: JSON.parse(localStorage.getItem('userinfo')).access_token
				})).then((res) => {
					console.log(res)
					for(let i=1; i<res.data.data.length; i++){
						this.list.push(res.data.data[i])
					}
				})
			},
			getList2: function() {
				// console.log(JSON.parse(localStorage.getItem('userinfo')).id)
				this.$axios.get('http://chonghekj.com/daily/index.php/Home/daily/detail',{
					params:{
						id: '9731149',
					}
				}).then((res) => {
					console.log(res)
				})
			}
		},
		mounted() {
			this.getList()
			// this.getList2()
		}
	}
</script>

<style lang="less" scoped>
	#app4{
		background: #F3F3F3;
	}
	.header7 {
		text-align: center;
		background: #F3F3F3;
		padding: 15px 0;
		position: relative;
		i {
			position: absolute;
			width: 25px;
			height: 25px;
			background: url(../assets/jiantou_logo.png) no-repeat;
			background-size: 100% 100%;
			left: 15px;
			top: 10px;
		}
	}
	#imgLocal{
		border: none;
	}
	.zong{
		display: flex;
		.text7{
			flex: 5;
			margin-bottom: 8px;
			border-top: #F3F3F3;
			border-bottom: #F3F3F3;
			border-left: #F3F3F3;
			.text7_sub{
				box-sizing: border-box;
				padding: 0 19px;
				height: 50px;
				margin-top: 21px;
			}
		}
		.photo7{
			flex: 2;
			.photo7_sub{
				box-sizing: border-box;
				padding: 5px 19px;
			}
			.photo8{
				width: 71px;
				height: 63px;
			}
		}
	}
</style>

<style>
</style>
